﻿@model  RiderShop.Mobile.Modle.MyAccount.MyPointModel
@section title
{
    鲜豆详情
}
@section pagetitle
{
    鲜豆详情
}
@section header
{
    <style>
        table tr th {
            text-align: center;
        }
        table tr td {
            text-align: center;
        }

            table tr td:first-child {
                max-width: 120px;
            }

            table tr td:last-child {
                color: #38b66e;
            }

            table tr td .memo {
                max-width: 120px;
                overflow: hidden;
                white-space: nowrap;
                text-overflow: ellipsis;
            }
    </style>
}






@if (Model.PointList == null)
{
    @Html.Raw("暂无鲜豆");
}
else
{
    <div class="box">
        <div class="panel">
            @* <ul class="nav nav-tabs nav-justified">
                 <li class="active"><a data-toggle="tab" href="#all">鲜豆明细</a></li>
                <li class=""><a data-toggle="tab" href="#get">获取鲜豆</a></li>
                     <li class=""><a data-toggle="tab" href="#using">消费鲜豆</a></li>
                        </ul>*@
            <div class="tab-content" id="myTabContent">
                <div id="all" class="tab-pane fade active in">
                    <table class="table">
                        <thead>
                            <tr>
                                <th>鲜豆详情</th>
                                <th>日期</th>
                                <th>收入/支出</th>
                            </tr>
                        </thead>

                        <tbody id="myPointList">
                            @*@foreach (var point in Model.PointList)
                                {
                                    <tr>
                                        <td>
                                            <span class="memo">@point.Memo</span>
                                        </td>
                                        <td>@point.TradeDate</td>
                                        @if (point.Increased > 0)
                                        {
                                            <td>+@point.Increased</td>
                                        }
                                        else
                                        {
                                            <td>-@point.Reduced</td>
                                        }
                                    </tr>

                                }*@
                            @Html.Partial("MyPointPartial", Model)

                        </tbody>
                    </table>


                    <div id="showMore" page="1">
                    </div>
                </div>
                @*<div id="get" class="tab-pane fade">


                        <table class="table">
                            <thead>
                                <tr>
                                    <th>鲜豆详情</th>
                                    <th>日期</th>
                                    <th>鲜豆</th>
                                </tr>
                            </thead>

                            <tbody>、
                                @foreach (var point in Model.PointList)
                                {
                                    <tr>
                                        <td>@point.Memo</td>
                                        <td>@point.TradeDate</td>
                                        <td>@point.Increased</td>
                                    </tr>
                                }
                            </tbody>
                        </table>


                    </div>

                    <div id="using" class="tab-pane fade">


                        <table class="table">
                            <thead>
                                <tr>
                                    <th>鲜豆详情</th>
                                    <th>日期</th>
                                    <th>鲜豆</th>
                                </tr>
                            </thead>
                            <tbody id="myPointList">
                                @foreach (var point in Model.PointList)
                                {
                                    <tr>
                                        <td>@point.Memo</td>
                                        <td>@point.TradeDate</td>
                                        <td>@point.Reduced</td>
                                    </tr>
                                }
                            </tbody>
                             <tbody id="showMore" page="1">
                                    <tr>
                                      <td id="showMoreIcon"></td><td id="showMoreLabel">加载更多...</td>
                                    </tr>
                            </tbody>
                        </table>
                    </div>*@

            </div>
        </div>
        <button id="btnCostMyPoint" type="button" class="btn btn-success btn-block mt20">使用鲜豆去消费</button>
    </div>
}
@section footer
{
    <script>
        $(function() {
            //得到预览元素
            $costMyPoint = $("#btnCostMyPoint");

            $costMyPoint.click(function() {
                window.location.href = "/";
            });

            //让toolbar选中
            var $homeImg = $("#homeImg");
            var $categoryImg = $("#categoryImg");
            var $myaccountImg = $("#myaccountImg");
            var $searchImg = $("#searchImg");
            $homeImg.attr("src", "/Themes/RongJi/Style/base/imgs/f10.png");
            $categoryImg.attr("src", "/Themes/RongJi/Style/base/imgs/f2.png");
            $myaccountImg.attr("src", "/Themes/RongJi/Style/base/imgs/f3_c.png");
            $searchImg.attr("src", "/Themes/RongJi/Style/base/imgs/f4.png");
            /*---------------------加载更多--------------------*/
            var isloading = false;
            //得到我的鲜豆
            var totalPage = @Model.TotalPage;
            if(totalPage > 1) {
                $(window).bind("scroll", function() {
                    if ($(document).scrollTop() + $(window).height() >= $(document).height()) {
                        var pageIndex = $('#showMore').attr('page');
                        $('#showMore').show().html('加载中...');
                        if(pageIndex >= totalPage) {
                            $("#showMore").show().html('没有更多了');
                            return;
                        }
                        if(isloading) {
                            return;
                        }
                        isloading = true;
                        $.ajax({
                            type: "GET",
                            url:  "MyPointByAjaxRequest?pageIndex=" + pageIndex,
                            dataType: "html",
                            success: function(response){
                                isloading = false;
                                $("#showMore").hide().html('加载更多...');
                                if(response.length){
                                    $('#showMore').attr('page',parseInt(pageIndex)+1);
                                }
                                $("#myPointList").append(response);
                            }
                        });
                    }
                });
            }
        });
    </script>
}


